<template>
  <!-- 附件三：故障维修记录及作业照片 -->
  <div class="attachment-3-wrap page">
    <div class="page-content page-index">
      <div class="row" style="padding-left:40px;">
        <form class="form-horizontal">
          <div class="form-group col-xs-12">
            <div class="text-left">
              <h3 class="h3" style="letter-spacing: 2px;">附件{{directoryOrder.attachment3}}：</h3>
            </div>
          </div>
          <div class="form-group col-xs-12">
            <div class="text-left">
              <h3 class="h3" style="letter-spacing: 2px;">故障维修记录及作业照片</h3>
            </div>
          </div>
        </form>
      </div>
    </div>
    <div class="page-break"></div>
    <div class="page-content">
      <div class="row">
        <form class="form-horizontal">
          <div class="form-group col-xs-8">
            <label class="col-xs-1 control-label"></label>
            <label class="col-xs-11 control-label font-bold text-left cid"></label>
          </div>
          <div class="form-group col-xs-12">
            <div class="text-center">
              <h3 class="h3" style="letter-spacing: 2px;">建筑消防设施故障维修记录单</h3>
            </div>
          </div>
          <div class="form-group col-xs-12">
            <div>
              <div class="pro-info">
                <div class="col-xs-5 text-left no-padding font-bold">项目名称：{{proname}}</div>
                <div class="col-xs-2 no-padding text-right font-bold">项目编号：</div>
                <div class="col-xs-5 no-padding">
                  <input type="text" placeholder="请输入项目编号" class="form-control no-border no-padding font-bold" v-model="currentPronum">
                </div>
              </div>
              <table id="maintainPlanTable" cellspacing="0" cellpadding="0" border="0">
                <template v-for="(item, index) in formData.fireRecord">
                  <tr class="active" :key="6*index+1">
                    <th class="text-left" colspan="2" width="60%"><span style="margin-left:5px;">{{index+1}}.1故障情况</span></th>
                    <th class="text-left" colspan="2" width="40%"><span style="margin-left:5px;">{{index+1}}.2影响评估、措施</span></th>
                  </tr>
                  <tr :key="6*index+2">
                    <td class="text-center" width="35%">
                      <div class="confirm col-xs-12 no-padding">
                        <div class="col-xs-4 no-padding">
                          <input type="text" readonly disabled class="form-control text-right no-border no-padding" value="发现时间：">
                        </div>
                        <div class="col-xs-8 no-padding">
                          <input type="text" readonly disabled class="form-control no-border no-padding" v-model="item.createTime">
                        </div>
                      </div>
                    </td>
                    <td class="text-center" width="20%">
                      <div class="confirm col-xs-12 text-left no-padding" style="line-height: 34px;padding-left:5px;">
                        发现人员：{{ item.createUser }}
                        <!-- <div class="col-xs-6 no-padding text-left">
                                                    <input type="text" readonly disabled class="form-control no-border text-right no-padding" value="发现人员：">
                                                </div> -->
                        <!-- <div class="col-xs-6 no-padding">
                                                    <input type="text" readonly disabled class="form-control no-border no-padding" v-model="item.createUser">
                                                </div> -->
                      </div>
                    </td>
                    <td class="text-center" colspan="2" width="45%">
                      <div class="confirm col-xs-12 no-padding">
                        <div class="col-xs-4 no-padding">
                          <input type="text" readonly disabled class="form-control no-border text-right" value="所属系统：">
                        </div>
                        <div class="col-xs-8 no-padding">
                          <input type="text" class="form-control no-border no-padding" v-model="item.systemName">
                        </div>
                      </div>
                    </td>
                  </tr>
                  <tr :key="6*index+3">
                    <td class="text-center" colspan="2" width="55%">
                      <div class="confirm col-xs-12 no-padding">
                        <div class="col-xs-3 no-padding">
                          <input type="text" readonly disabled class="form-control no-border text-right no-padding" value="故障部位：">
                        </div>
                        <div class="col-xs-9 no-padding">
                          <input type="text" readonly disabled class="form-control no-border no-padding" v-model="item.address">
                        </div>
                      </div>
                      <div class="confirm col-xs-12 no-padding">
                        <div class="col-xs-3 no-padding">
                          <input type="text" readonly disabled class="form-control no-border text-right no-padding" value="情况描述：">
                        </div>
                        <div class="col-xs-9 no-padding">
                          <input type="text" readonly disabled class="form-control no-border no-padding" v-model="item.description">
                        </div>
                      </div>
                    </td>
                    <td class="text-center" colspan="2" width="45%">
                      <div class="confirm col-xs-12 no-padding">
                        <div class="col-xs-12 no-padding" style="line-height: 34px;">
                          <div class="col-xs-6 no-padding">
                            <input name="system" type="checkbox" readonly disabled class="editable" :checked="item.isStopSystem == 0 || false" value="0">不停用系统
                          </div>
                          <div class="col-xs-6 no-padding">
                            <input name="system" type="checkbox" readonly disabled class="editable" :checked="item.isStopSystem == 1 || false" value="1">停用系统
                          </div>
                        </div>
                      </div>
                      <div class="confirm col-xs-12 no-padding">
                        <div class="col-xs-4 no-padding">
                          <input type="text" readonly disabled class="form-control no-border text-right no-padding" value="停用时间：">
                        </div>
                        <div class="col-xs-8 no-padding">
                          <input type="text" readonly disabled class="form-control no-border no-padding" v-model="item.stopTime">
                        </div>
                      </div>
                      <div class="confirm col-xs-12 no-padding">
                        <div class="col-xs-4 no-padding">
                          <input type="text" readonly disabled class="form-control no-border text-right no-padding" value="安全措施：">
                        </div>
                        <div class="col-xs-8 no-padding">
                          <input type="text" readonly disabled class="form-control no-border no-padding" v-model="item.safetyMethod">
                        </div>
                      </div>
                    </td>
                  </tr>
                  <tr class="active" :key="6*index+4">
                    <th class="text-left" colspan="2"><span style="margin-left:5px;">{{index+1}}.3维修情况</span></th>
                    <th class="text-left" colspan="2"><span style="margin-left:5px;">{{index+1}}.4故障排除确认</span></th>
                  </tr>
                  <tr :key="6*index+5">
                    <td class="text-center">
                      <div class="confirm col-xs-12 no-padding">
                        <div class="col-xs-4 no-padding">
                          <input type="text" readonly disabled class="form-control no-border text-right no-padding" value="维修时间：">
                        </div>
                        <div class="col-xs-8 no-padding">
                          <input type="text" readonly disabled class="form-control no-border no-padding" v-model="item.matainTime">
                        </div>
                      </div>
                    </td>
                    <td class="text-center">
                      <div class="confirm col-xs-12 no-padding text-left" style="line-height: 34px;padding-left:5px;">
                        维修人员：{{ item.matainUser }}
                        <!-- <div class="col-xs-16 no-padding text-left">
                                                    <input type="text" readonly disabled class="form-control no-border text-right no-padding" value="维修人员：">
                                                </div> -->
                        <!-- <div class="col-xs-5 no-padding">
                                                    <input type="text" readonly disabled class="form-control no-border no-padding" v-model="item.matainUser">
                                                </div> -->
                      </div>
                    </td>
                    <td class="text-center" colspan="2">
                      <div class="confirm col-xs-12 no-padding">
                        <div class="col-xs-4 no-padding" style="line-height: 34px;">
                          <input name="system" type="checkbox" readonly disabled class="editable" :checked="item.isFaultExclude == 1 || false" value="0">故障已排除
                        </div>
                        <div class="col-xs-8 no-padding text-left" style="line-height: 34px;">
                          确认人：{{ item.confirmUser }}
                          <!-- <input type="text" readonly disabled class="form-control no-border text-right no-padding" value="确认人："> -->
                        </div>
                        <!-- <div class="col-xs-4 no-padding" style="line-height: 34px;">
                                                    <input type="text" readonly disabled class="form-control no-border no-padding" v-model="item.confirmUser">
                                                </div> -->
                      </div>
                    </td>
                  </tr>
                  <tr :key="6*index+6">
                    <td class="text-center" colspan="2">
                      <div class="confirm col-xs-12 no-padding">
                        <div class="col-xs-3 no-padding">
                          <input type="text" readonly disabled class="form-control no-border text-right no-padding" value="维修方法：">
                        </div>
                        <div class="col-xs-9 no-padding">
                          <input type="text" readonly disabled class="form-control no-border no-padding" v-model="item.matainMethod">
                        </div>
                      </div>
                    </td>
                    <td class="text-center" colspan="2">
                      <div class="confirm col-xs-12 no-padding">
                        <div class="col-xs-4 no-padding" style="line-height: 34px;">
                          <input name="system" type="checkbox" readonly disabled class="editable" :checked="item.isFaultExclude == 0 || false" value="0">故障未排除
                        </div>
                        <div class="col-xs-8 no-padding text-left" style="line-height: 34px;">
                          跟进人：{{ item.followUser }}
                          <!-- <input type="text" readonly disabled class="form-control no-border text-right no-padding" value="跟进人："> -->
                        </div>
                        <!-- <div class="col-xs-4 no-padding">
                                                    <input type="text" readonly disabled class="form-control no-border no-padding" v-model="item.followUser">
                                                </div> -->
                      </div>
                      <div class="confirm col-xs-12 no-padding">
                        <div class="col-xs-4 no-padding">
                          <input type="text" readonly disabled class="form-control no-border text-right no-padding" value="待跟进事项：">
                        </div>
                        <div class="col-xs-8 no-padding">
                          <input type="text" readonly disabled class="form-control no-border no-padding" v-model="item.followDesc">
                        </div>
                      </div>
                    </td>
                  </tr>
                </template>
              </table>
            </div>
          </div>
          <div class="form-group col-xs-12 valid_cow" style="margin:0;padding:0;">
            <div class="col-xs-4 no-padding text-center">
              使用方负责人或跟进人签名：
            </div>
            <div class="col-xs-3 no-padding">
              <input type="text" readonly disabled class="form-control border-bottom font-bold no-padding">
            </div>
            <div class="col-xs-2 no-padding text-center">
              维修人员签名：
            </div>
            <div class="col-xs-2 no-padding">
              <input type="text" readonly disabled class="form-control border-bottom font-bold no-padding">
            </div>
          </div>
          <div class="form-group col-xs-12 valid_cow" style="margin:0;">
            <div class="col-xs-2 no-padding text-center">
              维修日期：
            </div>
            <div class="col-xs-2 no-padding">
              <input type="text" readonly disabled class="form-control border-bottom font-bold no-padding">
            </div>
            <div class="col-xs-2 no-padding text-center">
              维修时间：
            </div>
            <div class="col-xs-2 no-padding">
              <input type="text" readonly disabled class="form-control border-bottom font-bold no-padding">
            </div>
            <div class="col-xs-2 no-padding text-center">
              ，总工时：
            </div>
            <div class="col-xs-1 no-padding">
              <input type="text" readonly disabled class="form-control border-bottom font-bold no-padding">
            </div>
            <div class="col-xs-1 no-padding">
              （时）
            </div>
          </div>
        </form>
      </div>
    </div>
    <div class="page-break"></div>
    <!-- 作业图片 -->
    <work-imgs :workPic="formData.workPic" :status="status" :proname="proname" :pronum="currentPronum" :startTime="startTime" :endTime="endTime" ref="breakdownMaintenanceWorkImgs"></work-imgs>
  </div>
</template>
<script>
import WorkImgs from './WorkImgs'

export default {
  name: 'Attachment-3',
  props: {
    initData: {
      type: Object,
    },
    status: {},
    proname: {},
    pronum: {},
    startTime: {},
    endTime: {},
    directoryOrder: {
      type: Object,
      default: function () {
        return {}
      },
    },
  },
  components: {
    WorkImgs,
  },
  data() {
    return {
      currentPronum: this.pronum,
      formData: {
        fireRecord: [], // 故障维修记录
        workPic: [], // 故障维修作业图片
      },
    }
  },
  created() {
    let that = this
    if (that.initData) {
      that.formData.fireRecord = that.initData.fireRecord || [] // 故障维修记录
      that.formData.workPic = that.initData.workPic || [] // 故障维修作业图片
    }
  },
  methods: {
    // 获取数据
    getData() {
      let that = this

      that.formData.workPic = that.$refs.breakdownMaintenanceWorkImgs.getPicData()
      return that.formData
    },
  },
  watch: {
    pronum(val, oldVal) {
      if (val != oldVal) {
        this.currentPronum = val
      }
    },
    currentPronum(val, oldVal) {
      if (val != oldVal) {
        this.$emit('changePronum', val)
      }
    },
  },
}
</script>